<template>
	<view class="u-page">
		<checkbox-group @change="changeCheck">
		<view v-for="(item, index) in list" :key="index">		
			<u-cell customStyle="background:#fff;" :title="item.realname" :isLink="false">
				<view slot="label">
					<text style="margin-right: 10rpx;" class="tag-info">{{item.mobile}}</text>
				</view>
				<view slot="value">
					<label>
						选中 <checkbox :value="item.id" :checked="item.is_check" color="#3f9ad7"/>
					</label>	
				</view>
			</u-cell>
		</view>
		</checkbox-group>
		<view class="footer">
			<u-button type="primary" text="保存" @click="confirm"></u-button>
		</view>
	</view>
</template>

<script>
	import {methods} from '@/utils/methods.js';
	export default {
		data() {
			return {
				id:'',
				list:[],
				endData:false,
				page:1
			}
		},
		onPullDownRefresh() {
			this.list=[];
			this.endData=false;
			this.page=1;
			this.pagelist(true);
		},
		onReachBottom(){
			this.pagelist();
		},
		onLoad(e) {
			this.id=e.id;
			this.pagelist();
		},
		methods: {
			...methods,
			confirm:function(){
				let ids=[];
				this.list.forEach(res=>{
					if(res.is_check){
						ids.push(res.id);
					}
				});
				this.$post('admin/admin/setdriver',{id:this.id,driver:ids},true).then(res=>{
					setTimeout(res=>{
						uni.navigateBack();
					},1500)
				});
			},
			changeCheck:function(e){
				let list=[];
				let checkids=e.detail.value;
				for(let i=0;i<this.list.length;i++){
					this.list[i].is_check=0;
					for(let key in checkids){
						if(parseInt(checkids[key])==this.list[i].id){
							this.list[i].is_check=1;
						}
					}
					list.push(this.list[i]);
				}
				this.list=list;
			},
			pagelist:function(pulldown=false){
				if(this.endData){
					this.$msg('已经到底了');
					return;
				}
				this.$get("admin/admin/driver",{
					id:this.id,
					page:this.page
				},true).then(res=>{
					if(pulldown){
						uni.stopPullDownRefresh();
					}
					if(res.length<10){
						this.endData=true;
					}
					this.list=this.list.concat(res);	
					this.page++;	
				});		
			}
		}
	}
</script>

<style lang="scss">
	page{
		background-color: #eeeeee;
	}
	.u-page{
		padding-bottom: 120rpx;
	}
	.footer{
		position: fixed;
		bottom: 20rpx;
		width: 90%;
		left:5%;
	}
</style>